Conditions | 1 |
Paths | 2 |
Total Lines | 102 |
Lines | 102 |
Ratio | 100 % |
Changes | 0 |
Small methods make your code easier to understand, in particular if combined with a good name. Besides, if your method is small, finding a good name is usually much easier.
For example, if you find yourself adding comments to a method's body, this is usually a good sign to extract the commented part to a new method, and use the comment as a starting point when coming up with a good name for this new method.
Commonly applied refactorings include:
If many parameters/temporary variables are present:
1 | /* global pronamicPayAdminReports */ |
||
3 | jQuery( document ).ready( function( $ ) { |
||
4 | var container = $( '#chart1' ); |
||
5 | |||
6 | var drawChart = function( highlight ) { |
||
7 | // @see http://stackoverflow.com/a/817050 |
||
8 | var data = $.extend( true, [], pronamicPayAdminReports.data ); |
||
9 | |||
10 | if ( typeof highlight !== 'undefined' && data[ highlight ] ) { |
||
11 | var serie = data[ highlight ]; |
||
12 | |||
13 | serie.color = '#23282F'; |
||
14 | |||
15 | if ( serie.bars ) { |
||
16 | serie.bars.fillColor = '#23282F'; |
||
17 | } |
||
18 | |||
19 | if ( serie.lines ) { |
||
20 | serie.lines.lineWidth = 5; |
||
21 | } |
||
22 | } |
||
23 | |||
24 | // @see https://github.com/flot/flot/blob/master/API.md |
||
25 | var font = { |
||
26 | color: '#AAA', |
||
27 | size: 13 |
||
28 | }; |
||
29 | |||
30 | $.plot( container, data, { |
||
31 | legend: { |
||
32 | show: false |
||
33 | }, |
||
34 | grid: { |
||
35 | color: '#AAA', |
||
36 | borderColor: 'transparent', |
||
37 | borderWidth: 0, |
||
38 | hoverable: true |
||
39 | }, |
||
40 | xaxes: [ { |
||
41 | color: '#AAA', |
||
42 | position: 'bottom', |
||
43 | tickColor: 'transparent', |
||
44 | mode: 'time', |
||
45 | timeformat: '%b', |
||
46 | monthNames: pronamicPayAdminReports.monthNames, |
||
47 | tickLength: 1, |
||
48 | minTickSize: [ 1, 'month' ], |
||
49 | font: font |
||
50 | } ], |
||
51 | yaxes: [ |
||
52 | { |
||
53 | min: 0, |
||
54 | minTickSize: 1, |
||
55 | tickDecimals: 0, |
||
56 | color: '#D4D9DC', |
||
57 | font: font |
||
58 | }, |
||
59 | { |
||
60 | position: 'right', |
||
61 | min: 0, |
||
62 | tickDecimals: 2, |
||
63 | tickFormatter: function( val ) { |
||
64 | return accounting.formatMoney( val, '€' + ' ', 2, '.', ',' ); |
||
65 | }, |
||
66 | alignTicksWithAxis: 1, |
||
67 | color: 'transparent', |
||
68 | font: font |
||
69 | } |
||
70 | ] |
||
71 | } ); |
||
72 | }; |
||
73 | |||
74 | drawChart(); |
||
75 | |||
76 | jQuery( '[data-pronamic-pay-highlight-serie]' ).hover( |
||
77 | function() { |
||
78 | drawChart( jQuery( this ).data( 'pronamic-pay-highlight-serie' ) ); |
||
79 | }, |
||
80 | function() { |
||
81 | drawChart(); |
||
82 | } |
||
83 | ); |
||
84 | |||
85 | var tooltip = $( '<div class="pronamic-pay-chart-tooltip"></div>' ).appendTo( 'body' ); |
||
86 | |||
87 | container.bind( 'plothover', function( event, pos, item ) { |
||
88 | if ( item ) { |
||
89 | var text = item.datapoint[1].toFixed( 2 ); |
||
90 | |||
91 | if ( item.series.tooltipFormatter && 'money' === item.series.tooltipFormatter ) { |
||
92 | text = accounting.formatMoney( item.datapoint[1], '€ ', 2, '.', ',' ); |
||
93 | } |
||
94 | |||
95 | tooltip.html( text ).css( { |
||
96 | top: item.pageY - 16, |
||
97 | left: item.pageX + 20 |
||
98 | } ).fadeIn( 200 ); |
||
99 | } else { |
||
100 | tooltip.fadeOut( 100 ); |
||
101 | } |
||
102 | }); |
||
103 | |||
104 | } ); |
||
105 |